import React from 'react'
import { EditOutlined, EllipsisOutlined, SettingOutlined } from '@ant-design/icons'
import { Avatar, Card } from 'antd'
import './index.scss'

const { Meta } = Card

const meta = {
  border: 'solid'
}


const HomeCard = ({ logo, item }) => {
  return (
    <div>

      <Card
        hoverable
        style={{
          width: 230,
          height: '100%',
          border: '2px solid #eaff8f',
        }}
        cover={
          <img
            alt="example"
            src={logo}
            style={{
              width: '100%',
              border: '1px solid #eaff8f',
              borderBottom: '2px solid #eaff8f'
            }}
          />
        }
      >
        <Meta
          className={meta}
          avatar={<Avatar src={item.icon} className='avatar'/>}
          title={item.title}
          description={item.description}
        />
      </Card>
    </div>
  )
}

export default HomeCard